<template>
	<view>
		<u-tabbar :value="inputValue" :activeColor="activeColor" :fixed="true" :placeholder="true"
			:safeAreaInsetBottom="true" @change="eventChange">
			<u-tabbar-item v-for="(item,index) in menuList" :key="index" :text="item.title" :icon="item.icon"
				@click="eventClick(index,item)"></u-tabbar-item>
		</u-tabbar>
	</view>
</template>

<script>
	export default {
		name: "tabbar",
		data() {
			return {
				inputValue: this.value,
				activeColor: '#ffaa00',
				inactiveColor: '#7d7e80',
			};
		},
		props: {
			value: {
				type: Number,
				default: 0
			},
			menuList: {
				type: Array,
				default: []
			}
		},
		watch: {
			inputValue: function(newValue, oldValue) {
				// console.log('inputValue �仯��!');
				this.$emit('upWatch', {
					"newValue": newValue,
					"oldValue": oldValue
				});
			}
		},
		methods: {
			eventClick(index, item) {
				// tabbar切换页面时loading状态去掉
				this.$ut.apiStop();
				this.inputValue = index;
				//this.$emit('eventClick', item);
				//uni.$u.route(item.path,{type:'redirectTo'});
				uni.redirectTo({
					url: item.path
				});
			},
			eventChange(index) {
				this.$emit('eventChange', index);
			}
		},
	}
</script>

<style lang="less">

</style>